<template>
	<view class="container">
		<u-navbar title="" height="120upx">
			<view class="u-nav-slot" slot="left">
				<view @tap="back" class="icon-left">
					<u-icon name="arrow-left" color="#fff" size="26"></u-icon>
				</view>
			</view>
			<view class="u-nav-slot logoBox" slot="center">
				<view class="navBox">
					全部发售
				</view>
			</view>
			<view class="u-nav-slot" slot="right">
				<view class="icon-right">
					<!-- <u-icon name="more-dot-fill" color="#fff" size="24"></u-icon> -->
				</view>
			</view>
		</u-navbar>
		
		<view class="goods_list">
			<scroll-view class="listview" style="flex: 1;width: 100%;height: 100%;padding-bottom:40upx;"
			 enableBackToTop="true" scroll-y @scrolltolower="scrolltolower()">
				<goods_list_item :list="tabBoxList" :isEnd="isEnd" :isMore="isMore" />
				
				<view v-show="tabBoxList.length == 0" class="noListBox">
					<view class="noData">
						<image class="noDataImg" src="../../static/noData.png" mode=""></image>
					</view>
				</view>
			</scroll-view>
		</view>
		
		<mix-loading ref="min_loading"></mix-loading>
		
	</view>
</template>

<script>
	import goods_list_item from "./components/goods_list.vue"
	
	import {PATH_IMG, BASE_API} from '@/common/config.js';
	import {mapState ,mapMutations} from 'vuex'; 
	import {
		getCastingCollList,
	} from '@/api/home.js'
	export default {
		components:{goods_list_item},
		data() {
			return {
				tabBoxList:[],
				isEnd: false,
				isMore: false,
				current:0,
				listQuery: {
					page: 1,
					pageSize: 10,
					pages:1,
					status:"",//1发售中2代售3结束
					typeId:""
				},
				swiperCurrent:0,
			}
		},
		onLoad() {
			this.getSeriesList(false,1);
		},
		onShow() {
			if(!this.hasLogin){
				uni.reLaunch({
					url:"/pages/login/login"
				});
			}
		},
		computed:{
			...mapState(["hasLogin","uerInfo","h5Data"])
		},
		methods: {
			back() {
				let canNavBack = getCurrentPages();
				if(canNavBack && canNavBack.length>1) {  
				    uni.navigateBack({  
				      delta: 1  
				    });  
				} else {  
				    history.back();  
				}
			},
			getSeriesList(flag,i) {// 获取藏品发布列表数据
				if(i != 1){this.$refs.min_loading.open('加载中，请稍后！');}
				getCastingCollList(this.listQuery).then(res => {
					if (res.data.success) {
						this.listQuery.pages = res.data.obj.pages;
						
						if (res.data.obj.list.length == 0) {
							return;
						}
						let newList = res.data.obj.list.filter((item, index) => {
							if(item.metafile){
								item.metafile = JSON.parse(item.metafile);
								item["titleNM"] = item.metafile.name;
							}else{
								item["titleNM"] = "";
							}
							if(item.issuerHead){
								item.issuerHead = ((item.issuerHead).split(',')).map(item => {
									item = this.pathImg + item;
									return item;
								});
							}else{
								item.issuerHead = [];
							}
							if(item.fileUrl){
								item.fileUrl = (this.pathImg + item.fileUrl);
							}
							if(item.issuerName){
								let names = ((item.issuerName).split(',')).map(item => {
									item = item;
									return item;
								});
								item.issuerName = names[0];
							}else{
								item.issuerName = [];
							}
							if(item.startTime){
								item.startTime = this.moment(item.startTime).diff(new Date().getTime())
							}
							return item;
						});
						if(res.data.obj.list.length == 0){
							this.isEnd = true
						}
						if (this.listQuery.page == 1) {
							this.tabBoxList = [...newList];
						} else {
							this.tabBoxList = [...this.tabBoxList,...newList];
						}
					}
					uni.stopPullDownRefresh();
				}).catch(err=>{
					uni.stopPullDownRefresh();
				}).finally(() => {
					uni.stopPullDownRefresh();
					this.$refs.min_loading.close();
				});
			},
			scrolltolower(){
				if(this.listQuery.pages > this.listQuery.page){
					this.listQuery.page++;
					this.getSeriesList();
				}else{
					this.isEnd = true;
				}
			},
		},
		onPullDownRefresh() {//下拉刷新
			this.listQuery.page = 1;
			this.getSeriesList();
		}
	}
</script>
<style scoped lang="less">
	page{width: 100%;height: 100%;background-color: #F9F8F8;}
	.container {
		width: 100%;
		height: 100%;
		background-color: #F9F8F8;
		padding-top: 160upx;
		.icon-right{
			-webkit-transform: rotate(90deg);
			transform: rotate(90deg);
		}
		.logoBox{
			width: 100%;
			height: 100%;
			.navBox{
				height: 120upx;
				background-image: url("@/static/common/bg1.png");
				background-size: 100% 100%;
				background-repeat: no-repeat;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #fff;
			}
		}
		
		.goods_list {
			width: 100%;
			background-color: #F9F8F8;
			height: 100%;
			.listCentent{
				padding-bottom: 200upx;
				height:100%;
			}
		}

		.noListBox {
			height:100%;
			display: flex;
			align-items: center;
			justify-content: center;
			.noData {
				width: 220upx;
				height: 180upx;
				.noDataImg {
					width: 220upx;
					height: 180upx;
				}
			}
		}
	}
</style>
